<html>
<head>
<title>Remake de Fruity Frank - Version 0.06</title>
<style type="text/css">
span {
	font-family: 'Courier New';
	font-size: 10pt;
	color: #000000;
}
.SpanClass0 {
	color: #808080;
}
.SpanClass3 {
	color: #008080;
}
.SpanClass5 {
	font-weight: bold;
	color: #0000FF;
}
.SpanClass7 {
	color: #808080;
}
.SpanClass10 {
	font-weight: bold;
	color: #000080;
}
.SpanClass11 {
}
</style>
</head>
<body bgcolor="#FFFFFF">
<h2>Remake (parcial) de Fruity Frank... 06 - Transparencia y tiempo "fiable"</h2>
<p align="right">(Volver al <a href="doc.html">&iacute;ndice</a>) </p>
<p>Vamos a hacer dos peque&ntilde;as mejoras:</p>

<ul>
<li>Al mover nuestro personaje, se mueve tambi&eacute;n el recuadro negro que lo rodea. Quedar&iacute;a mucho mejor si ese recuadro negro no se viera, sino que nuestro personaje pareciera estar directamente sobre el fondo. Eso es f&aacute;cil de conseguir: no podemos usar im&aacute;genes en formatos que tengan transparencia, como el PNG o el GIF (al menos por ahora), porque la versi&oacute;n b&aacute;sica de la biblioteca SDL s&oacute;lo soporta el formato BMP, pero s&iacute; podemos indicar que uno de los colores que forman la imagen sea tratado como transparente.</li>
<li>La velocidad de nuestro juego depende de la velocidad del ordenador en el que lo probemos, hasta el punto de que puede resultar &quot;injugable&quot; en un ordenador muy r&aacute;pido, y eso no deber&iacute;a ocurrir.</li>
</ul>


<p>Para el primero de esos puntos, la transparencia, tenemos una orden en SDL (&quot;ocultada&quot; dentro de las funciones en espa&ntilde;ol que tenemos listas para usar) que permite indicar qu&eacute; color ser&aacute; considerado transparente, a partir de sus componentes RGB (rojo, verde, azul, indicados entre 0 y 255). Por ejemplo, si queremos que los puntos negros de la imagen sean considerados como transparentes, usaremos el color (0,0,0), o si queremos que lo sea el rojo puro, emplearemos (255,0,0).</p>

<p>En el caso de Fruity Frank, nuestro personaje tiene el pelo rojo y ropa azul, as&iacute; que podemos usar el verde puro (0,255,0) para indicar los puntos transparentes. Editamos nuestra imagen desde cualquier editor gr&aacute;fico (incluso el propio &quot;Paint&quot; de Windows servir&iacute;a) y pintamos en color verde intenso el contorno de nuestro personaje, que antes era negro. Despu&eacute;s le indicamos a nuestro juego que no dibuje ese verde, con:</p>

<pre><code>    personaje=SDLA_cargarImagen("personaje1.bmp");
    SDLA_colorTransparente(personaje, 0,255,0);</code></pre>

<p>De igual modo, nuestro primer enemigo tiene zonas rojas, blancas, negras... as&iacute; que el verde volver&iacute;a a ser una buena elecci&oacute;n para hacer su contorno transparente.</p>
    
<p>Por otra parte, para que la velocidad sea &quot;casi igual&quot; en cualquier ordenador, a&ntilde;adiremos una pausa entre un &quot;fotograma&quot; del juego y el siguiente. Si queremos que la visualizaci&oacute;n del juego tenga la velocidad habitual, 25 fotogramas por segundo, y suponemos que el tiempo que se pierde en redibujar la pantalla y en el an&aacute;lisis de la l&oacute;gica de juego es despreciable, deber&iacute;amos hacer una pausa de 40 milisegundos tras cada redibujado de pantalla (1 segundo = 1000 milisegundos; 1000 ms / 25 fps = 40 ms entre un &quot;fotograma&quot; y otro):</p>

<pre><code>    // Pausa de 40 ms, para velocidad de 25 fps (1000/40 = 25)
    SDLA_pausa(40);</code></pre>


<p>Como siempre, todo el proyecto est&aacute; en: <a href="http://code.google.com/p/fruityfrank"> code.google.com/p/fruityfrank</a></p>
<p align="right">(Volver al <a href="doc.html">&iacute;ndice</a>) </p>
</body>
</html>
